﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>调整表单控件尺寸</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="../demo.css" rel="stylesheet" type="text/css" />

    
    <script src="../../scripts/boot.js" type="text/javascript"></script>
        
    <link href="diysize.css" rel="stylesheet" type="text/css" />

</head>
<body>
    <h1>调整表单控件尺寸</h1>      
       

    <span style="width:80px;display:inline-block;">TextBox：</span>
        <input class="mini-textbox" style="width:200px;" />
    <br /><br />

    <span style="width:80px;display:inline-block;">ButtonEdit：</span>
        <input class="mini-buttonedit" style="width:200px;"/>
    <br /><br />

    <span style="width:80px;display:inline-block;">ComboBox：</span>
        <input class="mini-combobox" style="width:200px;"/>
    <br /><br />

    <span style="width:80px;display:inline-block;">DatePicker：</span>
        <input class="mini-datepicker" style="width:200px;"/>

    <br /><br />

    <span style="width:80px;display:inline-block;">Spinner：</span>
        <input class="mini-spinner" style="width:200px;"/>
    
    <br /><br />
    <span style="width:80px;display:inline-block;">Button：</span>
        <a class="mini-button" iconCls="icon-ok">确定</a>
        <a class="mini-button" iconCls="icon-cancel">取消</a>
            
        <a class="mini-button" style="width:60px;">确定</a>
        <a class="mini-button" style="width:60px;">取消</a>


    <script type="text/javascript">
        mini.parse();

      
    </script>
    
    

    <div class="description">
        <h3>Description</h3>
        <ul>
            <li>宽度可以通过style直接设置，如：style="width:200px"。</li>
            <li>Button、TextBox、ButtonEdit、ComboBox、DatePicker、Spinner等高度，只能通过CSS调整。</li>
        </ul>
    </div>
</body>
</html>